<!--
  Created by IntelliJ IDEA.
  User: Dai
  Date: 2018/4/26
  Time: 22:04
  Remark: 工程配置 -  对象管理 -  项目管理 - 编辑设备树 - 批量增加电池组和电池单体
  To change this template use File | Settings | File Templates.
-->
<!--标题栏-->
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h4 class="modal-title">批量导入模组和单体><span th:text="${name}"></span></h4>
</div>
<!--表格栏-->
<div class="modal-body">
    <div style="width: 100%;height: 200px;">
        <input type="hidden" id="package_id" th:value="${package_id}">
        <table style="width: 100%; overflow: auto">
            <thead>
            <tr>
                <td>序号</td>
                <td>模组名称</td>
                <td>下级电池单体命名规则</td>
                <td>流水号范围</td>
                <td>操作</td>
            </tr>
            </thead>
            <tbody id="group_table_tbody">

            </tbody>
        </table>
    </div>
</div>
<!--按钮栏-->
<div class="modal-footer">
    <button type="button" class="btn btn-default" onclick="check_info(this)">确定</button>
</div>
<!--js-->
<script>
    var source = [{_index: 0, num: 1, group_name: "1#电池模组", one_name: "#电池单体", one_low: 1, one_high: 3}];

    var num = 0;

    /**
     * 加载表格
     */
    function changeTable() {
        var index = 0;
        // 重新赋值
        $(source).each(function (i, v) {
            v._index = index++;
        });
        // 清空
        $("#group_table_tbody").empty();
        $(source).each(function (i, v) {
            var str =
                '<tr>\n' +
                '    <td>' + v.num + '</td>\n' +
                '    <td>\n' +
                '        <input type="text" value="' + v.group_name + '" class="get-value group-name-input" onchange="check_name(this,' + v._index + ')">\n' +
                '    </td>\n' +
                '    <td>\n' +
                '        <input type="text" style="width: 40px;" disabled>\n' +
                '        <span style="width: 50px">流水号</span>\n' +
                '        <input type="text" value="' + v.one_name + '" style="width: 120px" onchange="give_one_name(' + v._index + ', this)" class="get-value one-name-input">\n' +
                '    </td>\n' +
                '    <td>\n' +
                '        <input type="number" value="' + v.one_low + '" onblur="keyUpCheck(this, ' + v._index + ',  \'low\')" onkeyup="keyUpCheck(this, ' + v._index + ',  \'low\')"\n' +
                '               style="width: 40px" class="get-value one-name-low-input">\n' +
                '        <span>~</span>\n' +
                '        <input type="number" value="' + v.one_high + '" onblur="keyUpCheck(this, ' + v._index + ', \'high\')" onkeyup="keyUpCheck(this, ' + v._index + ', \'high\')"\n' +
                '               style="width: 40px" class="get-value one-name-high-input">\n' +
                '    </td>\n' +
                '    <td>\n' +
                '        <span class="button add_one" title="新增" onclick="addLine(' + v._index + ', ' + v.num + ')"></span>\n' +
                '        <span class="button delete" title="删除" onclick="deleteLine(' + v._index + ')"></span>\n' +
                '    </td>\n' +
                '</tr>';
            $("#group_table_tbody").append(str);
        });
    }

    /**
     * 检查名字是否正确
     */
    function check_name(input, _index) {
        // 当前输入的名称
        var name = $(input).val();
        if (!name) {
            alert("名称不能为空!!!");
            return false;
        }
        // 电池组 名称数组
        var names = [];
        $(source).each(function (i, v) {
            names.push(v.group_name);
        });
        // 去除当前的名称以前的值
        names.splice(_index, 1);
        if ($.inArray(name, names) != -1) {   // 判断数组中是否含有这个名字
            alert("名称不能重复");
            $(input).val("");
            return false;
        }
        //没有重复就赋值
        source[_index].group_name = name;
        return true;
    }

    /**
     * 新增
     */
    function addLine(_index, num) {
        // 获取_index对象并修改对应值
        var v = source[_index];
        var tr = $("#group_table_tbody tr").get(_index);
        if (!check_name($(tr).find("input.group-name-input"), _index)) {
            return false;
        }
        ;
        var inputs = $(tr).find("input.get-value");
        for (var i = 0; i < inputs.length; i++) {
            var input = inputs[i];
            if ($(input).hasClass("group-name-input")) {
                v.group_name = $(input).val();
            } else if ($(input).hasClass("one-name-input")) {
                v.one_name = $(input).val();
            } else if ($(input).hasClass("one-name-low-input")) {
                v.one_low = $(input).val();
            } else if ($(input).hasClass("one-name-high-input")) {
                v.one_high = $(input).val();
            }
        }
        // 不能为空校验
        if (!v.group_name || !v.one_name) {
            alert("名称不能为空");
            return false;
        }
        // 检查是否 low > high
        if (v.one_low > v.one_high) {
            alert("范围最小值不得大于最大值");
            return false;
        }
        // 没有重复就把当前行的对象赋值给source中对应的_index的对象
        source[_index] = v;
        ++num;
        // 再添加一行新的默认值
        var newGroup = {_index: num, num: num + 1, group_name: "1#电池模组", one_name: "#电池单体", one_low: 1, one_high: 3};
        source.push(newGroup);
        // 刷新table
        changeTable();
    }

    /**
     * 删除
     */
    function deleteLine(_index) {
        source.splice(_index, 1);
        changeTable();
    }

    /**
     * 正则表达式
     */
    function keyUpCheck(input, _index, type) {
        if (type == "low") {
            source[_index].one_low = $(input).val();
        } else if (type == "high") {
            source[_index].one_high = $(input).val();
        }
    }

    /**
     * 单体命名
     */
    function give_one_name(_index, input) {
        source[_index].one_name = $(input).val();
    }

    $(function () {
        /**
         * 初始化加载表格
         */
        changeTable();
    })

    /**
     * 检查填写的信息是否完整
     */
    function check_info(button) {
        var _index = $("#group_table_tbody tr").size() - 1;
        var input = $("#group_table_tbody tr:last").find(".group-name-input");
        if (!check_name(input, _index)) {
            return false;
        }
        $.post(
            '/project/objectManage/save_equipment_group',
            {
                source: JSON.stringify(source),
                id: $("#package_id").val(),
                project_id: $("#tree_id").val()
            },
            function (result) {
                if (result.type == "alert") {
                    alert(result.message);
                    return false;
                } else {
                    zNodes = result;
                    var treeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
                    treeObj.expandAll(true);    // 设置默认展开
                    // 关闭弹框
                    $(button).parent().siblings(":first").find("button").click();
                }
            }
        )
    }
</script>